<html>
<script type="text/javascript">
	function showHide()
        {
            if(document.getElementById('CPI').checked)
            {
                document.getElementById('div1').style.visibility = 'visible';
            }
            else
            {
                document.getElementById('div1').style.visibility = 'hidden';
            }
        }
		function showHide2()
        {
            if(document.getElementById('Nama').checked)
            {
                document.getElementById('div2').style.visibility = 'visible';
            }
            else
            {
                document.getElementById('div2').style.visibility = 'hidden';
            }
        }
		function showHide3()
        {
            if(document.getElementById('PL').checked)
            {
                document.getElementById('div3').style.visibility = 'visible';
            }
            else
            {
                document.getElementById('div3').style.visibility = 'hidden';
            }
        }
		function showHide4()
        {
            if(document.getElementById('Jabatan').checked)
            {
                document.getElementById('div4').style.visibility = 'visible';
            }
            else
            {
                document.getElementById('div4').style.visibility = 'hidden';
            }
        }
</script>
<body>
		  <div class="sidebar-widget">
            <form class="form-inline">
              <div class="input-append row-fluid">
				<label class="control-label" for="search">Cari Berdasarkan:</label>
				<br>
				<table border="0">
				<tr>
				<td>
				<label for="CPI">
					<input type="checkbox" id="CPI" value="CPI" checked="checked" onClick="showHide();">CPI
				</label>
				</td>
				<td>
				<label for="Nama">
					<input type="checkbox" id="Nama" value="Nama" checked="checked" onClick="showHide2();">Nama
				</label>
				</td>
				</tr>
				<tr>
				<td>
				<label for="PL">
					<input type="checkbox" id="PL" value="PL" checked="checked" onClick="showHide3();">PL
				</label>
				</td>
				<td>
				<label for="Jabatan">
					<input type="checkbox" id="Jabatan" value="Jabatan" checked="checked" onClick="showHide4();">Lama Jabatan
				</label>
				</td>
				</tr>
				</table>
                <input type="text" class="span7" id="div1" placeholder="CPI" />
				<br>
				<br>
                <input type="text" class="span7" id="div2" placeholder="Nama" />
                <br>
				<br>
                <input type="text" class="span7" id="div3" placeholder="PL" />
                <br>
				<br>
                <input type="text" class="span7" id="div4" placeholder="Jabatan" />
                <br>
				<br>
				<button type="submit" class="btn btn-info">Search</button>
              </div>
            </form>
          </div>
</body>
</html>